<template>
	<!-- 待办任务 -->
	<view class="scan-check">
		<view class="scan-head">
			<uni-card title="资产管理部用户A" sub-title="部门:资产管理部" thumbnail="../../static/img/1.webp" @click="onClick">
			</uni-card>

			<view style="background-color: #fff;">
				<uni-segmented-control :current="current" :values="items" style-type="text" active-color="#198a6c"
					@clickItem="onClickItem" />
			</view>
			<view style="background-color: #f4f4f4;" class="content">
				<view v-if="current === 0">
					<uni-card title="任务类型">
						<template v-slot:title>
							<view class="card-title">
								<view>
									<uni-icons type="map-pin-ellipse" size="18" color="#198a6c"></uni-icons>
									<text>任务类型</text>
								</view>
								<text class="right-txt">维修</text>
							</view>
						</template>
						<uni-list :border="false">
							<uni-list-item showArrow>
								<template v-slot:body>
									<view class="slot-box">
										<view class="list-content">
											<view>
												设备名称：
											</view>收音机
										</view>
										<view class="list-content">
											<view>位置：</view>清江东路店
										</view>
										<view class="list-content">
											<view>报修时间：</view>2021-12-08
										</view>
										<view class="list-content">
											<view>任务人：</view>张三
										</view>
									</view>
								</template>
							</uni-list-item>
						</uni-list>
					</uni-card>

					<uni-card title="任务类型">
						<template v-slot:title>
							<view class="card-title">
								<view>
									<uni-icons type="map-pin-ellipse" size="18" color="#198a6c"></uni-icons>
									<text>任务类型</text>
								</view>
								<text class="right-txt">维修</text>
							</view>
						</template>
						<uni-list :border="false">
							<uni-list-item showArrow>
								<template v-slot:body>
									<view class="slot-box">
										<view class="list-content">
											<view>
												设备名称：
											</view>收音机
										</view>
										<view class="list-content">
											<view>位置：</view>清江东路店
										</view>
										<view class="list-content">
											<view>报修时间：</view>2021-12-08
										</view>
										<view class="list-content">
											<view>任务人：</view>张三
										</view>
									</view>
								</template>
							</uni-list-item>
						</uni-list>
					</uni-card>

				</view>

				<view v-if="current === 1">11</view>
				<view v-if="current === 2">22</view>
				<view v-if="current === 3">33</view>
			</view>


		</view>


	</view>
</template>

<script lang="ts" setup>
	import {
		ref,
		onMounted
	} from 'vue'

	const customRules = []
	let customFormData = {}
	const candidates = []

	let current = ref(0);

	const items = ["全部", "位置", "任务人", "任务类型"];

	const onClickItem = (e: any) => {
		if (current !== e.currentIndex) {
			current.value = e.currentIndex;
		}
	};
	// 提交
	const endCheckBtn = () => {
		uni.navigateTo({
			url: '/pages/checkAssets/checkResult/index',
		})
	}
</script>

<style lang="scss" scoped>
	uni-page-body {
		height: 100%;
	}

	.scan-check {
		width: 100%;
		height: 100%;

		.scan-head {
			// height: 400rpx;
			display: flex;
			flex-direction: column;
			background: #026751;
			// background-size: 100% 100%;

			.uni-card {
				margin-top: 0 !important;
			}

			:deep(.uni-card__header) {
				border-bottom: 0 !important;
			}

			:deep(.uni-card__content) {
				padding: 0 !important;
			}

			:deep(.uni-card__header-content) {
				height: 180rpx !important;
				justify-content: flex-start !important;
			}

			:deep(.uni-card__header-content-subtitle) {
				margin-top: 36rpx !important;
			}

			:deep(.uni-card__header-avatar) {
				width: 180rpx !important;
				height: 180rpx !important;
			}

			:deep(.uni-card__header-avatar-image) {
				width: 180rpx !important;
				height: 180rpx !important;
			}

			.content-text {
				font-size: 14px;
				color: #666;
			}

			:deep(.content) {
				background-color: #fff !important;
			}

			.card-title {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 10px;
				border-bottom: 1px solid #ebeef5;

				.right-txt {
					font-size: 12px;
				}
			}

			.uni-list-item {
				font-size: 14px !important;
			}

			.list-content {
				display: flex;

				&>view {
					width: 140rpx;
					text-align: right;
				}
			}
		}



	}
</style>
